<script src="../ExternalLibrary/js/vue.js"></script>


<!-----------------------------Mustache语法不能作用在HTML特性上 start---------------------------->
<fieldset>
    <legend>02.双向绑定使html标签生效</legend>
    <p id="inner">{{innerTag}}</p>
    <script>
        var oUse = new Vue({
            el:"#inner",
            data:{
                innerTag:"Mustache语法不能作用在HTML标签内"//这样是不可以的,控制台报错
            }
        })
    </script>
</fieldset>
<!-----------------------------Mustache语法不能作用在HTML特性上 end---------------------------->

<!---------------作用在标签内,一般都是html属性,故而使用v-bind指令 start---------------------->
<fieldset>
    <legend>02.双向绑定使html标签生效</legend>
    <p>v-bind后面是：属性名=，我的理解是表示绑定这个属性，绑定之后，对应的值要去vue的数据里面找。</p>
    <div id="suiyilo">
        <button v-bind:disabled="innerTag">Button</button>
        <a v-bind:href="url">click me</a>
    </div>
    <script>
        var oUse = new Vue({
            // el:"#inner",
            el:"#suiyilo",
            data:{
                url:"https://www.baidu.com",//为什么不起作用？？？inner是关键字,作为id时不起作用
                innerTag:"false"//此处的false需要字符串形式,否则不生效
            }
        })
        
    </script>
</fieldset>
<!---------------作用在标签内,一般都是html属性,故而使用v-bind指令 end---------------------->
